<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">

	<title>活动</title>
	<link rel="stylesheet" href="../css/mui.min.css" />
	<link rel="stylesheet" href="../css/common.css" />
	<link rel="stylesheet" href="../iconfont/iconfont.css" />
	<style>
		.content{
			margin-bottom: 5px;
		}
		.active {
			color: #FC3A2E;
			border-bottom: 2px solid #FC3A2E;
		}
		
		.content > div {
			margin-bottom: 1px;
		}
		
		.activity-tx img {
			width: 100%;
			height: 100%;
			max-height: 87px;
			max-width: 87px;
		}
		
		.activity-info time {
			font-size: 12px;
			line-height: 12px;
		}
		
		.activity-info a {
			border-color: #FC3A2E;
		}
		
		.activity-info a:active {
			color: #FC3A2E;
		}
		
		.activity-btn button {
			border-color: #FC3A2E;
			padding-top: 0px;
			padding-bottom: 0;
		}
		
		.activity-img {
			padding-bottom: 15px;
		}
		
		.activity-img img {
			max-height: 120px;
			max-width: 120px;
			padding-left: 15px;
			padding-top: 15px;
		}
	</style>
</head>
<body>
	<!-- 顶部导航 开始 -->
	<header class="header mui-bar mui-bar-nav bar mui-text-center">
		<a class="mui-pull-left mui-action-back pad-h-md">
			<i class="iconfont icon-back"></i>
		</a>
		<a class="title">活动</a>
	</header>
	<!-- 顶部导航 结束 -->
	
	<!--活动详情 开始-->
	<div class="content">
		<div class="mui-row mui-text-center white">
			<div class="mui-col-xs-6 pad-v active">进行中</div>
			<div class="mui-col-xs-6 pad-v">已结束</div>
		</div>
		<div class="mui-row white pad-v pad-h">
			<div class="mui-col-xs-3 activity-tx">
				<img src="../image/txx.png">
			</div>
			<div class="mui-col-xs-6 pad-h activity-info">
				<label class="mui-block pad-v-sm">晒晒你的学习桌</label>
				<time class="mui-block text-gray">时间：01-27</time>
				<a class="text-primary pad-h-sm bdr rds mgn-v-sm mui-inline">活动进行中</a>
			</div>
			<div class="mui-col-xs-3 activity-btn pad-v-lg">
				<button class="mui-pull-right text-primary pad-h rds">立即参加</button>
			</div>
		</div>
		<div class="white pad-h pad-v-sm">
			<span>收到学习桌，是有妈妈安装还是由爸爸安装呢？晒晒想你的安装过程吧！</span>
		</div>
		<div class="mui-row white activity-img">
			<img class="mui-col-xs-4" src="../image/txx.png" />
			<img class="mui-col-xs-4" src="../image/txx.png" />
			<img class="mui-col-xs-4" src="../image/txx.png" />
			<img class="mui-col-xs-4" src="../image/txx.png" />
			<img class="mui-col-xs-4 pad-h pad-v" src="../image/tianjiatubiao.png" />
		</div>
	</div>
	<!--活动详情 结束-->
	
	<!--活动详情 开始-->
	<div class="content">
		<div class="mui-row mui-text-center white">
			<div class="mui-col-xs-6 pad-v active">进行中</div>
			<div class="mui-col-xs-6 pad-v">已结束</div>
		</div>
		<div class="mui-row white pad-v pad-h">
			<div class="mui-col-xs-3 activity-tx">
				<img src="../image/txx.png">
			</div>
			<div class="mui-col-xs-6 pad-h activity-info">
				<label class="mui-block pad-v-sm">晒晒你的学习桌</label>
				<time class="mui-block text-gray">时间：01-27</time>
				<a class="text-primary pad-h-sm bdr rds mgn-v-sm mui-inline">活动进行中</a>
			</div>
			<div class="mui-col-xs-3 activity-btn pad-v-lg">
				<button class="mui-pull-right text-primary pad-h rds">立即参加</button>
			</div>
		</div>
		<div class="white pad-h pad-v-sm">
			<span>收到学习桌，是有妈妈安装还是由爸爸安装呢？晒晒想你的安装过程吧！</span>
		</div>
		<div class="mui-row white activity-img">
			<img class="mui-col-xs-4 pad-h pad-v" src="../image/tianjiatubiao.png" />
		</div>
	</div>
	<!--活动详情 结束-->
	<script type="text/javascript" src="../js/mui.min.js"></script>
	<script type="text/javascript" src="../js/jquery.min.js"></script>
	<script type="text/javascript" src="../js/template.js"></script>
	<script type="text/javascript" src="../js/app.js"></script>
</body>
</html>